<!-- 套餐详情 -->
<template>
    <view class="index-page">
        <view class="topbackground">
            <view class="header" :style="{ paddingTop: heightConfig.navBarPaddingTop + 'px' }">
                <view class="Narbar_bo">
                    <view></view>
                    <view class="title" size="19px">套餐详情</view>
                    <view></view>
                </view>
                <view class="list">
                    <view class="one">
                        <image src="/static/images/logo.jpg" style="
                           margin:16rpx 0 0 10rpx;width: 193rpx;
                            height: 150rpx;"></image>
                    </view>
                    <view class="two">
                        <view class="center1">
                            儿童体检
                        </view>
                        <view class="center2">
                            包含内科检查、外科检查、视力筛查五官检查，系统检查
                        </view>
                    </view>
                    <view class="three">
                        <view class="right1">¥172.50</view>
                        <view class="right2" @click="appointMent">
                            <view class="text">点击预约</view>
                        </view>
                    </view>
                    <!-- </view> -->
                </view>
                    <view></view>

            </view>
        </view>
    </view>
</template>

<script>
    import api from "@/api/homePage";
    import loginApi from "@/api/login";
    import {
        getToken
    } from "@/utils/auth";
    import {
        getQueryString
    } from "@/utils/index";

    export default {
        name: "Index",
        components: {},
        data() {
            return {
                tuiGaiList: [{
                        message: '1.未到就诊当天可在线退号，就诊当天未取号可在11:30前在自助机或窗口进行退号，已取号凭挂号单在16: 30前到窗口办理退号退费，逾期将不可办理退号退费。'
                    },
                    {
                        message: '2.同一患者，一日内退号了次或一月内退号5次将无法进行线上挂号，退号，时间以退号时间开始计算。'
                    },
                    {
                        message: '3.同一患者，一日内预约未支付5次或每周7次将无法进行线上挂号。时间以预约未支付时间开始计算。'
                    },
                ],
                jCXuZhiList: [{
                        info: '预约:部分检查需提前预约 (如MRI、胃肠镜)，可通过医院平台或现场办理'
                    },
                    {
                        info: '登记签到: 按预约时间到指定科室登记，排队等候叫号。'
                    },
                    {
                        info: '配合操作:如彩超需暴露检查部位，CT/MRI需去除金属物品，保持体位静止'
                    },

                ],
                list3: [
                    'https://cdn.uviewui.com/uview/swiper/swiper3.png',
                    'https://cdn.uviewui.com/uview/swiper/swiper2.png',
                    'https://cdn.uviewui.com/uview/swiper/swiper1.png',
                ],
                taoCanList: [{
                        name: '心电图',
                        info: '检查心脏功能是否正常'
                    },
                    {
                        name: '血常规',
                        info: '有无贫血、血小板减少、血液病及炎症'
                    },
                    {
                        name: '肝功能 (6项)',
                        info: '了解肝脏功能，有无肝功能损害等'
                    },
                    {
                        name: '肾功能 (6项)',
                        info: '有无贫血、血小板减少、血液病及炎症'
                    },
                    {
                        name: '尿液常规检查',
                        info: '了解血液病及炎症'
                    }
                ],
                codeUserId: null, // 上级id
                heightConfig: {},
                keyword: "",
                swiperList: [], // 轮播
                profileList: [], // 简介
                referralsList: [],

                transitionShow: true,
                transitionMode: "slide-right",
                iconShow: true,
                iconMode: "slide-up",
            };
        },
        onLoad(query) {
            this.mainHeight = this.$store.getters.heightData.noTabMainHeight;
            this.heightConfig = this.$store.getters.heightData;
         //   this.getBannerList();
            // this.getReferralsList();

            const q = decodeURIComponent(query.q);
            let userId = getQueryString(q, "userId");
            this.codeUserId = userId || null;
            uni.setStorageSync("codeUserId", this.codeUserId);

            if (this.codeUserId) {
                let userInfo = uni.getStorageSync("userInfo");
                console.log(userInfo, 'userInfo');
                let obj = {
                    promotionId: this.codeUserId,
                    userId: userInfo.userId
                }
                console.log(obj, "obj");
                loginApi.binding(obj).then((res) => {
                    if (res.code == 200) {

                    } else {

                    }
                });
            }
        },
        onShow() {
            let launchOptions = uni.getLaunchOptionsSync();
            // 获取场景值 1011 - 扫描二维码进入
            if (launchOptions.scene == 1011) {
                let userInfo = uni.getStorageSync("userInfo");
                const token = getToken();
                if (userInfo.flag) {
                    uni.showToast({
                        title: `您的上级是${userInfo.parentNickName}`,
                        icon: "none",
                    });
                }
                if (!token) {
                    uni.navigateTo({
                        url: `/pages/login?codeUserId=${this.codeUserId}`,
                    });
                }
            }
        },
        onReady() {},
        methods: {
            // 预约
            appointMent() {
                uni.navigateTo({
                    url: "/subPages/appointMent/appointMnetDataSele",
                })
            },
            // banner
            getBannerList() {
                api.getBannerList().then((res) => {
                    if (res.code == 200) {
                        this.swiperList = [];
                        this.profileList = [];
                        res.data.forEach((element) => {
                            if (element.type == 1) {
                                this.swiperList.push(element);
                            }
                            if (element.type == 2) {
                                this.profileList.push(element);
                            }
                        });
                    }
                });
            },
            // 推荐
            getReferralsList() {
                api.getReferralsList().then((res) => {
                    if (res.code == 200) {
                        this.referralsList = res.data;
                    }
                });
            },
            swiperSkip(index, type) {
                if (type == 1) {
                    // 轮播图跳转
                    if (this.swiperList[index].goodId) {
                        uni.navigateTo({
                            url: `/subPages/details/goodDetail?id=${this.swiperList[index].goodId}`,
                        });
                    }
                } else if (type == 2) {
                    // 主页大图跳转
                    if (this.profileList[index].goodId) {
                        uni.navigateTo({
                            url: `/subPages/details/goodDetail?id=${this.profileList[index].goodId}`,
                        });
                    }
                }
            },
            searchFocus() {
                uni.navigateTo({
                    url: "/subPages/details/searchPage",
                });
            },
            switchIcon() {
                this.iconShow = !this.iconShow;
            },
            pageScroll() {
                let transitionShow = this.transitionShow;
                if (transitionShow) this.transitionShow = false;
                clearTimeout(this.timer);
                this.timer = setTimeout(() => {
                    this.transitionShow = true;
                    clearTimeout(this.timer);
                }, 1000);
            },
            clickNavigation(item) {
                const token = getToken();
                if (!token) {
                    uni.navigateTo({
                        // url: "/pages/login",
                    });
                } else {
                    if (item.id == 1) {
                        // 专属福利
                    } else if (item.id == 2) {
                        // 客服
                    } else if (item.id == 3) {
                        // 购物车
                        uni.switchTab({
                            url: "/pages/shopCar",
                        });
                    } else if (item.id == 4) {
                        // 活动订阅
                    }
                }
            },
        },
    };
</script>

<style lang="less" scoped>
    * {
        margin: 0;
        padding: 0;
        // background: #F7F8FA;
        // height: 1556rpx;
    }

    .topbackground {
        width: 100%;
        height: 344rpx;
        // background: url("/static/images2/首页顶部背景图.png") no-repeat;
        // background-size: 100% 100%;
    }

    .index-page {

        width: 750rpx;
        height: 100vh;
        overflow-y: scroll;
        background: #F7F8FA;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        flex-direction: column;
        // background-color: #fff;

        .header {
            width: 100%;
            // padding: 0 20rpx;
            // background-color: #fff;

            .logo {
                width: 200rpx;
                height: 60rpx;
                // background-color: #fee7eb;
                border-radius: 20px;
                text-align: center;
                line-height: 60rpx;
                margin: 0 auto;
            }

            .search {
                width: 670rpx;
                height: 72rpx;
                background: #FFFFFF;
                border-radius: 34rpx 34rpx 34rpx 34rpx;
                // padding: 20rpx 0;
                margin-left: 40rpx;
                margin-top: 10rpx;
                display: flex;
                justify-content: center;
                align-items: center;
            }
        }

        .Narbar_bo {
            width: 100%;
            height: 35px;
            display: flex;
            padding: 0 28rpx;
            justify-content: space-between;
            align-items: center;

            .title {
                font-size: 18px;
                font-weight: 600;
            }
        }
    }

    .list {
        display: flex;
        margin: 32rpx 32rpx 0;
        // border: 1rpx solid black;
        width: 686rpx;
        height: 190rpx;
        background: #F8FCFF;
        border-radius: 16rpx 16rpx 16rpx 16rpx;
    }

    .onge {
        width: 193rpx;
        height: 150rpx;
        background: #F6F6F6;
        border-radius: 12rpx 12rpx 12rpx 12rpx;

        image {
            width: 193rpx;
            height: 150rpx;
        }
    }

    .center1 {
        margin-top: 24rpx;
        width: 114rpx;
        height: 40rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        font-size: 28rpx;
        color: #333333;
        text-align: center;
        font-style: normal;
        text-transform: none;
    }

    .center2 {
        margin-top: 10rpx;
        width: 323rpx;
        height: 68rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 400;
        font-size: 24rpx;
        color: #777777;
        text-align: left;
        font-style: normal;
        text-transform: none;
    }

    .right1 {
        margin: 38rpx 0rpx 0 25rpx;
        width: 110rpx;
        height: 36rpx;
        font-family: Douyin Sans, Douyin Sans;
        font-weight: bold;
        font-size: 30rpx;
        color: #EB5432;
        text-align: center;
        font-style: normal;
        text-transform: none;
    }

    .right2 {

        margin: 42rpx 0 0 0;
        width: 146rpx;
        height: 52rpx;
        background: #159DFF;
        border-radius: 74rpx 74rpx 74rpx 74rpx;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .text {
        // text-overflow: ellipsis;
        // white-space: nowrap;
        width: 104rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        font-size: 26rpx;
        color: #FFFFFF;
        text-align: center;
        font-style: normal;
        text-transform: none;
    }
</style>